<!DOCTYPE html>
<html>
	<head>
	  <meta charset="utf-8">
	  <title>学生管理</title>
		<script src="../../layuilay/layui.js" charset="utf-8"></script>
		<script src="../../js/jquery-3.4.1.min.js" charset="utf-8"></script>
		<link rel="stylesheet" href="../../layuilay/css/layui.css"  media="all">
	</head>

	<body>
	<!-- 添加窗体开始———————————————————— -->
	<div id="addproductwin" style="display: none">
		<form class="layui-form" id="my_question">
			<div class="layui-form-item">
				<label class="layui-form-label">姓名</label>
				<div class="layui-input-inline">
					<input type="text" id="addname" name="name" required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
				<label class="layui-form-label">密码</label>
				<div class="layui-input-inline">
					<input type="text" id="addpassword" name="password" required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">以借书量</label>
				<div class="layui-input-inline">
					<input type="text" id="addborrowbook" name="borrowbook" value=0 required
						lay-verify="required" autocomplete="off" disabled="disabled" class="layui-input">
				</div>
				<label class="layui-form-label">性别</label>
                <div class="layui-input-block">
                  <input type="radio" name="addsex" value="男" title="男">
                  <input type="radio" name="addsex" value="女" title="女" checked>
                </div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">归还书量</label>
				<div class="layui-input-inline">
					<input type="text" id="addgivenbook" name="givenbook" value=0 required
						lay-verify="required" autocomplete="off" disabled="disabled" class="layui-input">
				</div>
				<div class="layui-input-inline" style="display: none">
					<input type="text" id="addstaus" name="staus" value=2 required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">最大借书量</label>
				<div class="layui-input-inline">
					<input type="text" id="addbigbook" name="bigbook" value=9 required
						lay-verify="required" autocomplete="off" disabled="disabled" class="layui-input">
				</div>
				<label class="layui-form-label">专业</label>
				<div class="layui-input-inline">
					<input type="text" id="addprofession" name="profession" required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item layui-form-text">
				<label class="layui-form-label">备注</label>
			    <div class="layui-input-block">
			      <textarea placeholder="请输入内容" id="addremark" name="remark"  class="layui-textarea">不写点什么嘛╯︿╰</textarea>
			    </div>
			</div>
			<div class="layui-form-item">
				<div class="layui-input-block">
					<button type="button" class="layui-btn layui-btn-warm"
						onclick="saveaddStubtn()">添加保存</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</div>
			</div>
		</form>
	</div>
	<!-- 添加窗体结束 -->
		<!-- 修改窗体开始—————————————————— -->
	<div id="updatestu" style="display: none">
		<form class="layui-form" action=""  lay-filter="fm">
			<div class="layui-form-item">
				<label class="layui-form-label">姓名</label>
				<div class="layui-input-inline">
					<input type="text" id="updatename" name="name" required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
				<label class="layui-form-label">密码</label>
				<div class="layui-input-inline">
					<input type="text" id="updatepassword" name="password" required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">以借书量</label>
				<div class="layui-input-inline">
					<input type="text" id="updateborrowbook" name="borrowbook" value=0 required
						lay-verify="required" autocomplete="off" disabled="disabled" class="layui-input">
				</div>
			    <label class="layui-form-label">性别</label>
			    <div class="layui-input-block">
			      <input type="radio" name="sex" value="男" title="男">
			      <input type="radio" name="sex" value="女" title="女" checked>
			    </div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">归还书量</label>
				<div class="layui-input-inline">
					<input type="text" id="updategivenbook" name="givenbook" value=0 required
						lay-verify="required" autocomplete="off" disabled="disabled" class="layui-input">
				</div>
				<div class="layui-input-inline" style="display: none;">
					<input type="text" id="updatestaus" name="staus" value=2 required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
			</div>
			<div class="layui-form-item">
				<label class="layui-form-label">最大借书量</label>
				<div class="layui-input-inline">
					<input type="text" id="updatebigbook" name="bigbook" value=9 required
						lay-verify="required" autocomplete="off" disabled="disabled" class="layui-input">
				</div>
				<label class="layui-form-label">专业</label>
				<div class="layui-input-inline">
						<select id="updateprofession" name="profession" onfocus="selPro()">
                                                <option value="">请选择</option>
                                            </select>
				</div>
			</div>
			<div class="layui-form-item layui-form-text">
				<label class="layui-form-label">备注</label>
			    <div class="layui-input-block">
			      <textarea placeholder="请输入内容" id="updateremark" name="remark"  class="layui-textarea">不写点什么嘛╯︿╰</textarea>
			    </div>
			</div>
			<div class="layui-form-item">
				<div class="layui-input-block">
					<button type="button" class="layui-btn layui-btn-normal"
						onclick="saveupdateStubtn()">修改保存</button>
					<button type="reset" class="layui-btn layui-btn-primary">重置</button>
				</div>
			</div>
			<div class="layui-input-inline" style="display: none">
					<input type="text" id="updaterid" name="r_id" required
						lay-verify="required" autocomplete="off" class="layui-input">
				</div>
		</form>
	</div>
	<!-- 修改窗体结束 -->
		<!-- 检索框开始———————————————————— -->
		<div class="layuimini-container">
			<div class="layuimini-main">
				<fieldset class="layui-elem-field layuimini-search">
					<legend>搜索信息</legend>
					<div style="margin: 10px 10px 10px 10px">
						<form class="layui-form layui-form-pane" action="">
							<div class="layui-form-item">
								<div class="layui-inline">
									<label class="layui-form-label">学号</label>
									<div class="layui-input-inline">
										<input type="text" id="r_id" autocomplete="off"
											class="layui-input">
									</div>
								</div>
								<div class="layui-inline">
									<label class="layui-form-label">姓名</label> 
									<div class="layui-input-inline">
										<input type="text" id="r_name"  autocomplete="off"
											class="layui-input">
									</div>
								</div>
								<div class="layui-inline">
									<label class="layui-form-label">专业</label>
									<div class="layui-input-inline">
											<select id="r_profession" onfocus="selPro()">
												<option value="">请选择</option>
											</select>
									</div>
								</div>
								<div class="layui-inline" style="display: none;">
								<label class="layui-form-label">状态</label>
								<div class="layui-input-inline">
									<select class="form_select" id="stas" >
											<option value="2">学生</option>
										</select>
									</div>
								</div>
								
								<div class="layui-inline">
									<button type="button" class="layui-btn layui-btn-normal layui-btn-radius" onclick="searchBtn()"><i class="layui-icon">&#xe615</i></button>
								</div>
							</div>
						</form>
					</div>
				</fieldset>
	
			<!-- 检索框结束 -->
			<!-- 数据表格开始———————————————————— -->

			<table id="demo" lay-filter="test"></table>

			<script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit">编辑</a>
        </script>
		<script type="text/html" id="toolbarDemo">
		<div class="layui-btn-group" >
			<input class="layui-btn layui-btn-normal layui-btn-radius" type="button" value="添加" onclick="addStudent()"/>
			<button type="button" id="upload1" title="导入" class="layui-btn layui-btn-primary layui-btn-radius"><i class="layui-icon">&#xe67c;</i></button>
			<button type="button" title="导出" class="layui-btn layui-btn-primary layui-btn-radius" onclick="stuExport()"><i class="layui-icon">&#xe67d;</i></button>
    	</div>
		</script>
		</div>
	</div>
	<!-- 数据表格结束 -->
		
		
	<!-- 表格渲染开始—————————————————— -->
		<script>
		$(function(){
			searchBtn();
 		    selPro()
			})
			function searchBtn(){
				   var r_id=$("#r_id").val();//
				   var r_name=$("#r_name").val();
				   var r_profession=$("#r_profession").val();
				   var stas=$("#stas option:selected").val();
					if(r_id==''){
						r_id = 0;
						}
				layui.use(['table','jquery','upload','layer','form'], function(){
					   var table = layui.table;
					   var $ = layui.$;
					   var upload = layui.upload;
					   var layer = layui.layer;
					   var form = layui.form;
					   
					   tableObj =table.render({
					    elem: '#demo'
					    ,url:'/findcondition'
						,toolbar: '#toolbarDemo'
						,where:{
							r_id:r_id,
							name:r_name,
							profession:r_profession,
							staus:stas    	 
						} 
					    ,cols: [[
					    	{field: 'r_id', title: '教师号',sort: true,fixed: 'left'}
						      ,{field: 'name', title: '姓名'}
						      ,{field: 'sex', title: '性别'} 
						      ,{field: 'password', title: '密码'}
						      ,{field: 'profession', title: '专业',align:"center"}
						      ,{field: 'borrowbook', title: '已借图书量',sort: true}
						      ,{field: 'givenbook', title: '归还图书量', sort: true}
						      ,{field: 'bigbook', title: '最大借书量', sort: true}
						      ,{field: 'remark', title: '备注'}
						      ,{field: 'staus', title: '状态',hide: true,}
						      ,{field: '', title: '操作',fixed: 'right',align:"center",toolbar: '#barDemo'}
					    ]]
					  ,page: true
					  });
					 
				//文件导入操作
				   var uploadInst = upload.render({
					    elem: '#upload1'
					    ,url: '/importExcel' //改成您自己的上传接口
					    ,accept: 'file' //普通文件
					    ,exts: 'xls|xlsx' //只允许上传压缩文件
						,method:"POST"
					    ,done: function(res){
						    if(res.success){
								layer.msg(res.message);
								tableObj.reload();
							    }
					    }
					  });
					 //监听行工具事件
					 
				   table.on('tool(test)', function(obj){
					  var data = obj.data;  // 获得当前行数据
					  var layEvent = obj.event; // 获得 lay-event 对应的值（也可以是表头的event 参数对应的值）
				     if(obj.event === 'edit'){
				    	  form.val('fm',data);
						    uindex= layer.open({
						    	//form.val('fm',data);
						    	 type:1
						    	 ,title:"学生信息修改"
						    	 ,content:$("#updatestu")
						    	 ,area:["669px","430px"]
						     })
				     }
				   });
					});
				}
		
		//导出点击事件
		
			function stuExport(){
				if(confirm("确认导出吗")){
				layui.use("jquery",function(){
					var $= layui.$;
				//异步请求 ajax
				$.ajax({
					url:"/stuExport"
					,data:{}
					,dataType:"json"
					,type:"POST"
					,success:function(res){
						if(res.success){
							layer.msg(res.message);
							}
						}
					})
					})
				}
			}
		
		//点击添加保存
		   function saveaddStubtn(){
		   	var addname = $("#addname").val();
		   	var addpassword = $("#addpassword").val();
		   	var addborrowbook = $("#addborrowbook").val();
		   	var addsex = $("input[name='addsex']:checked").val();
		   	var addgivenbook = $("#addgivenbook").val();
		   	var addstaus = $("#addstaus").val();
		   	var addbigbook = $("#addbigbook").val();
		   	var addremark = $("#addremark").val();
		   	var addprofession = $("#addprofession").val();
		   	 if(addname==""){
		   		 layer.msg("姓名不能为空");
		   	}else if(addpassword==""){
		   	 layer.msg("密码不能为空");
		   	}else if(addborrowbook==""){
		   	 layer.msg("借书量不能为空");
		   	}else if(addsex==""){
		   	 layer.msg("性别不能为空");
		   	}else if(addgivenbook==""){
		   	 layer.msg("归还量不能为空");
		   	}else if(addstaus==""){
		   	 layer.msg("状态不能为空");
		   	}else if(addbigbook==""){
		   	 layer.msg("最大借书量不能为空");
		   	}else if(addremark==""){
		   	 layer.msg("备注不能为空");
		   	}else if(addprofession==""){
		   	 layer.msg("专业不能为空");
		   	}else if(addprofession==""){
		   	 layer.msg("最大借书量不能为空");
		   	}else{
		   	 	$.post("/insertStu",{
		   	 		name:addname,
		   	 		password:addpassword,
		   	 		borrowbook:addborrowbook,
		   	 		sex:addsex,
		   			givenbook:addgivenbook,
		   			staus:addstaus,
		   			bigbook:addbigbook,
		   			profession:addprofession,
		   			remark:addremark
			   	},function(res){
			   		if(res.success){
						$("#my_question")[0].reset();
			   			//关闭窗体
						layer.msg(res.message);
			  			layer.close(index);
			  			tableObj.reload();
			   		}
			   	},"json");
		   	}
		  
		   }
		 //点击修改提交事件
		var uindex;
			 function saveupdateStubtn(){
				 	var updaterid = $("#updaterid").val();
				 	var updateremark = $("#updateremark").val();
				   	var updateprofession = $("#updateprofession").val();
				   	var updatebigbook = $("#updatebigbook").val();
				   	var updatestaus = $("#updatestaus").val();
				   	var updategivenbook = $("#updategivenbook").val();
				   	var updatesex = $("input[name='sex']:checked").val();
				   	var updateborrowbook = $("#updateborrowbook").val();
				   	var updatepassword = $("#updatepassword").val();
				   	var updatename = $("#updatename").val();
				   	 if(updatename==""){
				   		 layer.msg("姓名不能为空");
				   	}else if(updatepassword==""){
				   	 layer.msg("密码不能为空");
				   	}else if(updateborrowbook==""){
				   	 layer.msg("借书量不能为空");
				   	}else if(updatesex==""){
				   	 layer.msg("性别不能为空");
				   	}else if(updategivenbook==""){
				   	 layer.msg("归还量不能为空");
				   	}else if(updatestaus==""){
				   	 layer.msg("状态不能为空");
				   	}else if(updatebigbook==""){
				   	 layer.msg("最大借书量不能为空");
				   	}else if(updateremark==""){
				   	 layer.msg("备注不能为空");
				   	}else if(updatebigbook==""){
				   	 layer.msg("最大借书量不能为空");
				   	}else if(updateprofession==""){
				   	 layer.msg("专业不能为空");
				   	}else{
				   		$.post("/updateStu",{
				   			r_id:updaterid,
				   			name:updatename,
				   	 		password:updatepassword,
				   	 		borrowbook:updateborrowbook,
				   	 		sex:updatesex,
				   			givenbook:updategivenbook,
				   			staus:updatestaus,
				   			bigbook:updatebigbook,
				   			profession:updateprofession,
				   			remark:updateremark
					   		
					   	},function(res){
					   		if(res.success){
					   			layer.msg(res.message);
					  			layer.close(uindex);
					  			tableObj.reload();
					   		}
					   	},"json");
				   	}
				   	
				   }
		   //点击添加按钮
		   var index;
		   function addStudent(){
		   	layui.use("layer",function(){
		   		var layer = layui.layer;
		   		index = layer.open({
		   			type:1
		   			,title:"添加学生信息",
		   			content:$("#addproductwin")
		   			,area:["669px","430px"]
		   	})
		   	})
		   }
		</script>
		<!-- 表格渲染结束 -->
		<!-- js事件开始———————————————— -->
		<script >
			//查询专业名称
			function selPro(){
				$.ajax({
					url:"/selProfession",
					data:{},
					dataType:"json",
					type:"post",
					success:function(res){
						if(res.length>0){
							for(var i=0;i<res.length;i++){
							$("#r_profession").append("<option value='"+res[i]+"'>"+res[i]+"</option>");
							$("#updateprofession").append("<option value='"+res[i]+"'>"+res[i]+"</option>");

							}}}
					})
				}
			function updatePro(){
				$.ajax({
					url:"/selProfession",
					data:{},
					dataType:"json",
					type:"post",
					success:function(res){
						if(res.length>0){
							for(var i=0;i<res.length;i++){
							$("#updateprofession").append("<option value='"+res[i]+"'>"+res[i]+"</option>");

							}}}
					})
				}

			 
		</script>
		
		<!-- js事件结束 -->
		
	</body>
</html>